//
// Dom7
// Export selectors engine

// 先初始化主界面
// Template
var template = document.getElementById('indexTemplate').innerHTML;
var compiled = Template7(template).compile();
var compiledRendered = compiled(index);
// Insert rendered template
document.getElementById('view_container').innerHTML = compiledRendered;


/*再来初始化APP*/
var $$ = Dom7;

// 初始化APP
var myApp = new Framework7({
    preprocess: preProcess,
    onPageInit: function (app, page) {
        var pageName = page.name;
        if (IndexPages.indexOf(pageName) > -1) {
            //首页以及首页的三个页面，无需返回，无需添加历史记录
        } else {
            pushHistory(titles[name]);
        }
    },
    onPageBeforeAnimation: function (app, page) {
        var title = titles[page.name];
        if (title === undefined || title === '')
            title = appName;
        document.title = title;
    }
});

// 添加主界面
var mainView = myApp.addView('.view-main', {
    dynamicNavbar: true
});

/*全局设置ajax加载过程的动画*/
$$(document).on('ajaxStart', function (e) {
    if (e.detail.xhr.requestUrl.indexOf('autocomplete-languages.json') >= 0) {
        // Don't show preloader for autocomplete demo requests
        return;
    }
    myApp.showIndicator();
});
$$(document).on('ajaxComplete', function (e) {
    if (e.detail.xhr.requestUrl.indexOf('autocomplete-languages.json') >= 0) {
        // Don't show preloader for autocomplete demo requests
        return;
    }
    myApp.hideIndicator();
});


/**
 * 监听浏览器返回键，然后返回上一页,如果当前页面是首页的三个页面，则不返回
 */
window.addEventListener("popstate", function (e) {
    var pageName = mainView.activePage.name;
    if (IndexPages.indexOf(pageName) === -1) {
        mainView.router.back();
    }
    console.log('active page: ', pageName);
}, false);


//全局变量，可以保存用户的信息
Template7.global = {
    username: '孙悟空',
    phone: '18198131234'
};

//toolbar的显示切换
$$('.tab').click(function () {
    $$('.tab.active').removeClass('active');
    $$(this).toggleClass('active')
});

mainView.router.loadPage({
    url: './index/home.html',
    animatePages: false
});

/**
 * 进入预约中心后，切换为指定的tab,在初始化之前显示，
 * 免得出现切换效果
 */
myApp.onPageBeforeInit("orders", function (page) {
    var pageIndex = $$('.tabs').attr('data-index');
    console.log('pageIndex: ', pageIndex);
    if (pageIndex === '2') {
        myApp.showTab('#tab3');
    } else if (pageIndex === '3') {
        myApp.showTab('#tab4');
    }
});

/**
 * 进入预约界面，初始化日历控件
 */
myApp.onPageBeforeInit('order-page', function (page) {
    $.getScript('../static/custom/js/order/order-page.js')
});

/*商品详情界面，手动切换toolbar*/
/*为了这个，做了好多工作*/
myApp.onPageInit('goods-detail', function () {

    $$('.open-info').on('click', function () {
        myApp.pickerModal('.picker-info')
    });

    $$('.btn-decrease').on('click', function () {
        var number = $$('#goods_number').val();
        console.log('decrease: ', number);
        if (number > 1) {
            $$('#goods_number').val(number - 1)
        }
        if (parseInt(number) === 2) {
            $$('.btn-decrease').removeClass('active')
        }
    });

    $$('.btn-add').on('click', function () {
        console.log('add: ');
        var number = $$('#goods_number').val();
        $$('#goods_number').val(parseInt(number) + 1);
        $$('.btn-decrease').addClass('active');
    });

});

myApp.onPageBack('goods-detail', function () {
    myApp.showToolbar('#index-toolbar');
});

myApp.onPageBeforeAnimation('goods-detail', function () {
    console.log('before Animation');
    myApp.hideToolbar('#index-toolbar');
    myApp.showToolbar('#goods-tools');
});

